<template>
  <div class="app-container calendar-list-container">

    <!-- 查询和其他操作 -->
    <div class="filter-container">
      <el-input clearable class="filter-item" style="width: 200px" placeholder="请输入机构名称" v-model="listQuery.name">
      </el-input>
      <el-input clearable class="filter-item" style="width: 200px" placeholder="请输入法人姓名" v-model="listQuery.legalPerson">
      </el-input>
      <el-input clearable class="filter-item" style="width: 200px" placeholder="请输入手机号" v-model="listQuery.telephone">
      </el-input>
      <el-cascader clearable class="filter-item" style="width: 150px" placeholder="请选择机构类目" expand-trigger="hover" v-model="categoryIds" :options="categorylist" @change="handleCategoryChange">
      </el-cascader>
      <el-cascader clearable class="filter-item" style="width: 150px" placeholder="请选择机构等级" expand-trigger="hover" v-model="mLevelIds" :options="mLevelList" @change="handleLevelChange">
      </el-cascader>
      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
      <el-button class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加</el-button>
      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">模板下载</el-button>
      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-upload2" @click="handleExport">导出</el-button>

      <div class="file-box">
        <input id="upload" type="file" class="file-btn" @change="importfxx(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" /> 批量导入
      </div>
    </div>

    <el-table size="small" :data="list" v-loading="listLoading" element-loading-text="正在查询中。。。" border fit highlight-current-row>

      <el-table-column align="center" width="100px" label="机构ID" prop="id" sortable>
      </el-table-column>

      <el-table-column align="center" min-width="100px" label="机构名称" prop="name">
      </el-table-column>
      <el-table-column align="center" min-width="100px" label="机构简称" prop="nickName">
      </el-table-column>
      <el-table-column align="center" min-width="80px" label="代理归属id" prop="affiliation">
      </el-table-column>
      <el-table-column align="center" min-width="80px" label="机构分类" prop="mcategoryId">
        <template slot-scope="scope">
          <el-tag>{{cList[scope.row.mcategoryId]}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" min-width="200px" label="机构等级" prop="level">
        <template slot-scope="scope">
          <el-tag>{{LList[scope.row.level]}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" min-width="100px" label="具体位置" prop="address">
      </el-table-column>
      <el-table-column align="center" min-width="80px" label="法人" prop="legalPerson">
      </el-table-column>

      <el-table-column align="center" min-width="100px" label="机构电话号码" prop="telephone">
      </el-table-column>
      <!-- <el-table-column align="center" min-width="100px" label="相关资质信息" prop="qualifications">
      </el-table-column> -->

      <!-- <el-table-column align="center" min-width="100px" label="积分总额" prop="integralAmountAll">
      </el-table-column> -->

      <el-table-column align="center" min-width="100px" label="已用额度" prop="integralAmountUsed">
      </el-table-column>
      <!-- <el-table-column align="center" property="qualifications" label="机构图片">
        <template slot-scope="scope">
          <img :src="scope.row.qualifications" width="50" />
        </template>
      </el-table-column> -->
      <el-table-column align="center" min-width="150px" label="激活时间" prop="startTime">
      </el-table-column>
      <el-table-column align="center" min-width="150px" label="到期时间" prop="endTime">
      </el-table-column>
      <el-table-column align="center" label="操作" width="280" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
          <el-button type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
          <el-button type="success" size="mini" @click="handleSelectUser(scope.row)">人员</el-button>

        </template>
      </el-table-column>
    </el-table>

    <!-- 分页 -->
    <div class="pagination-container">
      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listQuery.page" :page-sizes="[10,20,30,50]" :page-size="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
      </el-pagination>
    </div>

    <!-- 修改和添加对话框 -->
    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
      <el-form :rules="rules" ref="dataForm" :model="dataForm" status-icon label-position="left" label-width="100px" style='width: 400px margin-left:50px'>
        <el-form-item label="机构名称" prop="name">
          <el-input v-model="dataForm.name"></el-input>
        </el-form-item>
        <el-form-item label="机构简介" prop="nickName">
          <el-input v-model="dataForm.nickName"></el-input>
        </el-form-item>
        <el-form-item label="机构类型" prop="mechanismType">
          <el-input v-model="dataForm.mechanismType"></el-input>
        </el-form-item>
        <el-form-item label="机构分类" prop="mcategoryId">
          <el-select v-model="dataForm.mcategoryId">
            <el-option v-for="item in mcategory" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="机构等级" prop="level">
          <el-select v-model="dataForm.level" @change="selectLevel">
            <el-option v-for="item in mlevel" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="代理使用权" prop="level">
          <el-switch v-model="dataForm.proxyUseFlag" active-value="true" inactive-value="false" :disabled="proxyUseFlag">
          </el-switch>
        </el-form-item>
        <el-form-item label="代理归属" prop="affiliation">
          <el-autocomplete class="inline-input" v-model="affiliationText" :fetch-suggestions="querySearch" placeholder="请输入代理归属的机构名称" :trigger-on-focus="false" @select="handleSelect">
          </el-autocomplete>
        </el-form-item>
        <el-form-item label="区域地址">
          <el-select v-model="dataForm.provinceId" placeholder="省" @change="provinceChange">
            <el-option v-for="item in provinces" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
          <el-select v-model="dataForm.cityId" placeholder="市" @change="cityChange">
            <el-option v-for="item in cities" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
          <el-select v-model="dataForm.areaId" placeholder="区" @change="areaChange">
            <el-option v-for="item in areas" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
          <el-select v-show="false" v-model="dataForm.areaId" placeholder="s" @change="areasChange">
            <el-option v-for="item in areass" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="具体位置" prop="address">
          <el-input v-model="dataForm.address"></el-input>
        </el-form-item>
        <el-form-item label="法人" prop="legalPerson">
          <el-input v-model="dataForm.legalPerson"></el-input>
        </el-form-item>
        <el-form-item label="机构电话号码" prop="telephone">
          <el-input v-model="dataForm.telephone"></el-input>
        </el-form-item>
        <el-form-item label="积分额度" prop="integralAmountAll">
          <el-input v-model="dataForm.integralAmountAll"></el-input>
        </el-form-item>
        <el-form-item label="宣传画廊">
          <el-upload :action='uploadPath' :headers="headers" :limit='5' multiple accept=".jpg,.jpeg,.png,.gif" :file-list="galleryFileList" list-type="picture-card" :on-exceed='uploadOverrun' :on-success="handleGalleryUrl" :on-remove="handleRemove">
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="激活时间" prop="startTime" v-if="dialogStatus=='create'">
          <el-date-picker v-model="dataForm.startTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="激活时间" prop="startTime" v-if="dialogStatus=='update'">
          <el-date-picker v-model="dataForm.startTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" :disabled='true'>
          </el-date-picker>
        </el-form-item>
        <el-form-item label="到期时间" prop="endTime" v-if="dialogStatus=='update'">
          <el-date-picker v-model="dataForm.endTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取消</el-button>
        <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确定</el-button>
        <el-button v-else type="primary" @click="updateData">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<style>
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 200px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
}

.file-box {
  position: absolute;
  display: inline-block;
  text-align: center;
  position: relative;
  font-size: 15px;
  margin-left: 200px; /* margin-bottom: 40px; */

  padding: 5px;
  /* margin: 5px 250px; */
  margin-top: 10px;
  height: 30px;
  width: 80px;
  color: #fff;
  border-radius: 3px;
  background-color: rgba(71, 133, 240, 0.863);
}
.file-btn {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  outline: none;
  background-color: rgb(41, 27, 165);
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}
.avatar {
  width: 150px;
  height: 140px;
  display: block;
}
.inline-input {
  width: 300px;
}
</style>

<script>
import {
  listMechanism,
  listTotalMechanism,
  createMechanism,
  updateMechanism,
  deleteMechanism,
  importMechanism,
  reimportMechanism,
  checkMechanismName,
  choseAffiliation,
  getAffiliation
} from '@/api/mechanism'
import { listAllMCategory, listMechanisLevel } from '@/api/mechanismCategory'
import { getToken } from '@/utils/auth'
import { listSubRegion } from '@/api/region'
import { createStorage, uploadPath } from '@/api/storage'

export default {
  name: 'Mechanism',
  computed: {
    headers() {
      return {
        'X-Token': getToken()
      }
    }
  },
  data() {
    var validName = (rule, value, callback) => {
      // console.log(this.dialogStatus)
      if (value === '') {
        callback(new Error('请输机构名称'))
      } else {
        var params = {}
        params.status = this.dialogStatus
        params.id = this.dataForm.id
        params.name = value
        checkMechanismName(params).then(response => {
          var validFlag = response.data.data
          // console.log(response)
          if (validFlag) {
            callback()
          } else {
            callback(new Error('机构名称已存在！'))
          }
        })
      }
    }
    return {
      uploadPath,
      qualificationsFileList: [],
      list: undefined,
      total: undefined,
      galleryFileList: [],
      listLoading: true,
      mechanism: { qualifications: [] },
      proxyUseFlag: false,
      listQuery: {
        page: 1,
        limit: 20,
        name: undefined,
        nickName: undefined,
        sort: '+id',
        mcategoryId: undefined,
        level: undefined
      },
      provinces: {},
      cities: {},
      areas: {},
      areass: {},
      dataForm: {
        id: undefined,
        name: undefined,
        nickName: undefined,
        mechanismType: undefined,
        address: undefined,
        legalPerson: undefined,
        telephone: undefined,
        qualifications: [],
        integralAmountAll: 1000000,
        provinceId: undefined,
        cityId: undefined,
        areaId: undefined,
        street: undefined,
        username: undefined,
        password: undefined,
        fullName: undefined,
        mechanismId: undefined,
        startTime: undefined,
        endTime: undefined,
        mcategoryId: undefined,
        level: undefined,
        proxyUseFlag: undefined,
        affiliation: undefined
      },
      dialogFormVisible: false,
      dialogStatus: '',
      textMap: {
        update: '编辑机构',
        create: '创建机构'
      },
      rules: {
        name: [
          { required: true, message: '机构名称不能为空', trigger: 'blur' },
          { validator: validName, trigger: 'blur' }
        ],
        username: [{ required: true, message: '管理员名称不能为空', trigger: 'blur' }],
        password: [{ required: true, message: '密码不能为空', trigger: 'blur' }]
      },
      downloadLoading: false,
      mcategory: [],
      categoryIds: [],
      categorylist: [],
      mlevel: [],
      mLevelList: [],
      mLevelIds: [],
      cList: {},
      LList: {},
      affiliationText: undefined
    }
  },

  created() {
    this.getList()
    this.getProvinces()
    this.getmcategory()
    this.getmlevel()
  },

  methods: {
    importfxx(obj) {
      this.loading = this.$loading({
        lock: true,
        text: '机构导入中。。。',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      const _this = this
      // let inputDOM = this.$refs.inputer
      // 通过DOM取文件数据
      this.file = event.currentTarget.files[0]
      var rABS = false
      var f = this.file
      var reader = new FileReader()
      FileReader.prototype.readAsBinaryString = function(f) {
        var binary = ''
        var rABS = false
        // var pt= this
        var wb
        var outdata
        var reader = new FileReader()
        reader.onload = function(e) {
          var bytes = new Uint8Array(reader.result)
          var length = bytes.byteLength
          for (var i = 0; i < length; i++) {
            binary += String.fromCharCode(bytes[i])
          }
          var XLSX = require('xlsx')
          if (rABS) {
            // wb = XLSX.read(btoa(fixdata(binary)), {
            //   type: 'base64'
            // })
          } else {
            wb = XLSX.read(binary, {
              type: 'binary'
            })
          }
          outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])
          for (var j = 0; j < outdata.length; j++) {
            var data = outdata[j]
            var importData = []
            importData['address'] = data['机构地址']
            importData['name'] = data['机构名称']
            importData['nickName'] = data['机构简称']
            importData['legalPerson'] = data['机构法人']
            importData['mechanismType'] = data['机构类型']
            importData['telephone'] = data['机构电话']
            importData['username'] = data['机构管理员名称']
            importData['password'] = data['管理员密码']
            importData['fullName'] = data['管理显示名称']
            importData['integralAmountAll'] = '1000000'
            importMechanism(importData).then(response => {
              if (response.data.data === '主要信息不能为空') {
                _this.$notify({
                  title: '失败',
                  message: '主要信息不能为空,请重新填写!',
                  type: 'warning',
                  duration: 0
                })
                return false
              }

              // this.list.unshift(response.data.data)
              // this.dialogFormVisible = false
              const count = response.data.data.count
              var legalPersonCount = response.data.data.legalPersonCount
              var nameCount = response.data.data.nameCount
              var name = response.data.data.name
              if (count === 0) {
                _this.getList()
                _this.loading.close()
                _this.$notify({
                  title: '成功',
                  message: '导入成功',
                  type: 'success',
                  duration: 2000
                })
              } else if (legalPersonCount > 0 && nameCount === 0) {
                _this
                  .$confirm('是否导入机构:' + name + '?', '提示', {
                    confirmButtonText: '确认',
                    cancelButtonText: '取消',
                    type: 'warning'
                  })
                  .then(() => {
                    reimportMechanism(response.data.data).then(response => {
                      _this.getList()
                      _this.loading.close()
                      _this.$notify({
                        title: '成功',
                        message: '导入成功',
                        type: 'success',
                        duration: 2000
                      })
                    })
                    return
                  })
              } else {
                var namenew = ' '
                namenew = name + namenew
                _this.getList()
                _this.loading.close()
                _this.$notify({
                  title: '提醒',
                  message: '有重复机构名：' + namenew,
                  type: 'warning',
                  duration: 0
                })
              }
            })
          }
        }
        event.target.value = ''
        reader.readAsArrayBuffer(f)
      }
      if (rABS) {
        reader.readAsArrayBuffer(f)
      } else {
        reader.readAsBinaryString(f)
      }
      this.getList()
      this.loading.close()
    },
    uploadPicUrl: function(response) {
      console.log(response.data.url)
      this.dataForm.qualifications.push(response.data.url)
      // console.log(response.data)
    },
    handleImport() {
      console.log('handleImport')
    },
    getProvinces() {
      listSubRegion({ id: 0 }).then(response => {
        this.provinces = response.data.data
      })
    },
    handleRemove: function(file, fileList) {
      for (var i = 0; i < this.dataForm.qualifications.length; i++) {
        // 这里存在两种情况
        // 1. 如果所删除图片是刚刚上传的图片，那么图片地址是file.response.data.url
        //    此时的file.url虽然存在，但是是本机地址，而不是远程地址。
        // 2. 如果所删除图片是后台返回的已有图片，那么图片地址是file.url
        var url
        if (file.response === undefined) {
          url = file.url
        } else {
          url = file.response.data.url
        }

        if (this.goods.gallery[i] === url) {
          this.goods.gallery.splice(i, 1)
        }
      }
    },
    provinceChange(val) {
      if (val === undefined) {
        return
      }
      this.cities = {}
      this.dataForm.cityId = undefined
      this.areas = {}
      this.dataForm.areaId = undefined
      listSubRegion({ id: val }).then(response => {
        this.cities = response.data.data
      })
    },
    cityChange(val) {
      if (val === undefined) {
        return
      }
      this.areas = {}
      this.dataForm.areaId = undefined
      listSubRegion({ id: val }).then(response => {
        this.areas = response.data.data
      })
    },
    areaChange(val) {
      if (val === undefined) {
        return
      }
      this.areass = {}
      this.dataForm.street = undefined
    },
    areasChange(val) {},
    getList() {
      this.listLoading = true
      this.listQuery.mcategoryId = this.categoryIds[0]
      this.listQuery.level = this.mLevelIds[0]
      listMechanism(this.listQuery)
        .then(response => {
          this.list = response.data.data.items
          this.total = response.data.data.total
          this.listLoading = false
        })
        .catch(() => {
          this.list = []
          this.total = 0
          this.listLoading = false
        })
    },
    getmcategory() {
      listAllMCategory()
        .then(response => {
          this.mcategory = response.data.data.mcategory
          this.categorylist = response.data.data.brandList
          for (let i = 0; i < this.categorylist.length; i++) {
            this.cList[this.categorylist[i].value] = this.categorylist[i].label
          }
        })
        .catch(() => {
          this.mcategory = []
        })
    },
    getmlevel() {
      listMechanisLevel()
        .then(response => {
          this.mlevel = response.data.data.ListProxy
          this.mLevelList = response.data.data.brandList
          for (let i = 0; i < this.mLevelList.length; i++) {
            this.LList[this.mLevelList[i].value] = this.mLevelList[i].label
          }
        })
        .catch(() => {
          this.mlevel = []
        })
    },
    handleFilter() {
      this.listQuery.page = 1
      this.getList()
    },
    handleSizeChange(val) {
      this.listQuery.limit = val
      this.getList()
    },
    handleCurrentChange(val) {
      this.listQuery.page = val
      this.getList()
    },
    resetForm() {
      this.dataForm = {
        id: undefined,
        name: undefined,
        nickName: undefined,
        mechanismType: undefined,
        address: undefined,
        legalPerson: undefined,
        telephone: undefined,
        qualifications: [],
        integralAmountAll: 1000000,
        provinceId: undefined,
        cityId: undefined,
        areaId: undefined,
        username: undefined,
        password: undefined,
        fullName: undefined,
        mechanismId: undefined,
        startTime: undefined,
        endTime: undefined,
        mcategoryId: undefined,
        affiliation: undefined
      }
    },
    uploadAvatar(item) {
      const formData = new FormData()
      formData.append('file', item.file)
      createStorage(formData)
        .then(res => {
          this.dataForm.avatar = res.data.data.url
        })
        .catch(() => {
          this.$message.error('上传失败，请重新上传')
        })
    },
    handleCreate() {
      this.resetForm()
      this.cities = {}
      this.areas = {}
      this.dialogStatus = 'create'
      this.dialogFormVisible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].clearValidate()
      })
      this.galleryFileList = []
      for (var i = 0; i < this.dataForm.qualifications.length; i++) {
        this.galleryFileList.push({
          url: this.dataForm.qualifications[i]
        })
      }
    },

    uploadOverrun: function() {
      this.$message({
        type: 'error',
        message: '上传文件个数超出限制!最多上传5张图片!'
      })
    },
    handleGalleryUrl(response, file, fileList) {
      if (response.errno === 0) {
        this.dataForm.qualifications.push(response.data.url)
      }
    },

    handleCategoryChange(value) {
      this.goods.categoryId = value[value.length - 1]
    },
    handleLevelChange(value) {
      this.goods.level = value[value.length - 1]
    },
    createData() {
      this.$refs['dataForm'].validate(valid => {
        if (valid) {
          for (var i = 0; i < this.list.length; i++) {
            if (this.dataForm.name === this.list[i].name) {
              this.$message({
                message: '显示名称不能重复',
                type: 'warning'
              })
              return false
            }
            if (this.dataForm.nickName === this.list[i].nickName) {
              this.$message({
                message: '简称不能重复',
                type: 'warning'
              })
              return false
            }
          }
          createMechanism(this.dataForm).then(response => {
            this.list.unshift(response.data.data)
            this.dialogFormVisible = false
            this.$notify({
              title: '成功',
              message: '创建成功',
              type: 'success',
              duration: 2000
            })
          })
        }
      })
    },
    handleUpdate(row) {
      this.dataForm = Object.assign({}, row)
      this.dialogStatus = 'update'
      this.cities = {}
      this.areas = {}
      if (this.dataForm.affiliation !== undefined) {
        getAffiliation({ affiliation: this.dataForm.affiliation }).then(response => {
          this.affiliationText = response.data.data.affText
        })
      } else {
        this.affiliationText = ''
      }
      if (this.dataForm.level < 3) {
        this.proxyUseFlag = true
      } else {
        this.proxyUseFlag = false
      }
      if (this.dataForm.provinceId) {
        listSubRegion({ id: this.dataForm.provinceId }).then(response => {
          this.cities = response.data.data
        })
      }
      if (this.dataForm.cityId) {
        listSubRegion({ id: this.dataForm.cityId }).then(response => {
          this.areas = response.data.data
        })
      }
      this.dialogFormVisible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].clearValidate()
      })
    },
    querySearch(queryString, callback) {
      var lists = [{}]
      var list = [
        {
          value: '没有查到符合条件的机构',
          id: 0
        }
      ]
      // console.log(this.dataForm.affiliation)
      // console.log(isNaN(this.dataForm.affiliation))
      choseAffiliation({ level: this.dataForm.level, id: this.dataForm.id, name: queryString })
        .then(response => {
          if (response.data.data.brandList.length === 0) {
            lists = list
          } else {
            lists = response.data.data.brandList
          }
          callback(lists)
        })
        .catch(error => {
          console.log(error)
        })
    },
    handleSelect(item) {
      this.dataForm.affiliation = item.id
      this.affiliationText = item.value
    },
    selectLevel() {
      this.affiliationText = ''
      if (this.dataForm.level > 2) {
        this.proxyUseFlag = false
        this.dataForm.proxyUseFlag = true
      } else {
        this.proxyUseFlag = true
        this.dataForm.proxyUseFlag = false
      }
    },
    updateData() {
      updateMechanism(this.dataForm).then(() => {
        for (const v of this.list) {
          if (v.id === this.dataForm.id) {
            const index = this.list.indexOf(v)
            this.list.splice(index, 1, this.dataForm)
            break
          }
        }
        this.dialogFormVisible = false
        this.$notify({
          title: '成功',
          message: '更新成功',
          type: 'success',
          duration: 2000
        })
      })
    },
    handleSelectUser(row) {
      this.$router.push({ path: '/mechanism/mechanismUser', query: { mechanismId: row.id }})
    },
    handleDelete(row) {
      this.$confirm('此操作删除该信息, 是否继续?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteMechanism(row).then(response => {
          this.$notify({
            title: '成功',
            message: '删除成功',
            type: 'success',
            duration: 2000
          })
          const index = this.list.indexOf(row)
          this.list.splice(index, 1)
        })
      })
    },
    handleDownload() {
      this.downloadLoading = true
      import('@/vendor/Export2Excel').then(excel => {
        const tHeader = [
          '机构名称',
          '机构简称',
          '机构类型',
          '机构地址',
          '机构法人',
          '机构电话',
          '机构管理员名称',
          '管理员密码',
          '管理显示名称'
        ]
        const filterVal = []
        excel.export_json_to_excel2(tHeader, this.list, filterVal, '机构信息模板')
        this.downloadLoading = false
      })
    },
    handleExport() {
      import('@/vendor/Export2Excel').then(excel => {
        listTotalMechanism(this.listQuery).then(response => {
          const tHeader = [
            '机构ID',
            '机构名称',
            '机构简称',
            '机构类型',
            '具体位置',
            '法人',
            '机构电话号码',
            '积分总额',
            '已用额度',
            '激活时间',
            '到期时间'
          ]
          const filterVal = [
            'id',
            'name',
            'nickName',
            'mechanismType',
            'address',
            'legalPerson',
            'telephone',
            'integralAmountAll',
            'integralAmountUsed',
            'startTime',
            'endTime'
          ]
          const list = response.data.data.items
          excel.export_json_to_excel2(tHeader, list, filterVal, '机构信息')
          this.downloadLoading = false
        })
      })
    }
  }
}
</script>
